function CalendarOverviewHeader(dom, repository, calendarHeaderStatus) {
    this._dom = dom;
    this._container = $('<div/>');
    this._repository = repository;
    this._headerStatus = calendarHeaderStatus;
    this._headerStatusChangeCallback = function() { };
    this._updateMonthStatus = function(visibleMonthModels) {
        var me = this;
        visibleMonthModels.foreach(function(monthModel) {
            var yearMonth = monthModel.getYearMonth();
            var completeStatus = monthModel.getCompleteStatus();
            $('li[year=' + yearMonth.year() + '][month=' + yearMonth.month() + ']', me._dom)
            .removeClass()
            .addClass(me._getCompletenessStatusClass(completeStatus))
        });
    };

    ///TODO: wyh need to simplify this method
    this._fillMonthItemsInMonthBar = function(visibleMonths, monthBar) {
        var lastWrittenYear = null;
        visibleMonths.foreach(function(monthModel) {
            var yearMonth = monthModel.getYearMonth();
            var monthIndex = yearMonth.month();
            var monthTitle = CalendarViewHeader.MONTH_SHORT_TITLES[monthIndex - 1];
            var monthItem = $('<span></span>').html(monthTitle).addClass("month");
            var monthStatusIndicator = $("<span></span>").addClass("month-status-indicator");

            var yearItem = "";
            if ((monthIndex == 1 || monthIndex == 12) && lastWrittenYear != yearMonth.year()) {
                lastWrittenYear = yearMonth.year();
                yearItem = $('<span></span>').html(yearMonth.year()).addClass("year");
            }

            var monthLiItem = $("<li></li>")
                .append(yearItem)
                .append(monthItem)
                .append(monthStatusIndicator)
                .attr("year", yearMonth.year())
                .attr("month", yearMonth.month());

            monthBar.append(monthLiItem);
        });
    };
}
CalendarOverviewHeader.prototype = new CalendarViewHeader();
